<!DOCTYPE html>
<html>
	<head>
		<title>CSS Reftest Reference</title>
		<link rel="author" title="Mihai Balan" href="mibalan@adobe.com">
		<style>
		ul:first-of-type, ol:first-of-type {
			color: blue;
		}
		ul:nth-of-type(3) {
			color: green;
		}
		ol, ul {
			margin: 0;
			padding: 0;
		}

		.region {
			margin: 2em;
			background-color: lightgray;
			width: 200px;
		}
		</style>
	</head>
	<body>
		<p>This test passes if there are two gray rectangles:  the first with two numbered lists (3 items each), the second with three un-numbered lists (2 items each).<br>
		First list of each type should be blue, second list of each type should be black and the third un-ordered list should be green.
		</p>
		<p>Each numbered list should start at 1.<br>
		Both the numbers and the list markers should be outside of the gray rectangles.</p>
		<div class="region" id="r1">
			<ol>
				<li>Ordered list 1, item 1</li>
				<li>Ordered list 1, item 2</li>
				<li>Ordered list 1, item 3</li>
			</ol>
			<ol>
				<li>Ordered list 2, item 1</li>
				<li>Ordered list 2, item 2</li>
				<li>Ordered list 2, item 3</li>
			</ol>
		</div>
		<div class="region" id="r2">
			<ul>
				<li>Unordered list 1, item 1</li>
				<li>Unordered list 1, item 2</li>
			</ul>
			<ul>
				<li>Unordered list 2, item 1</li>
				<li>Unordered list 2, item 2</li>
			</ul>
			<ul>
				<li>Unordered list 3, item 1</li>
				<li>Unordered list 3, item 2</li>
			</ul>
		</div>
	</body>
</html>